<template>
  <div class="bread-crumb-container">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item
        v-for="(item, index) in breadList"
        :key="index"
        :to="{ path: item.path }"
        >{{ item.name }}</el-breadcrumb-item
      >
    </el-breadcrumb>
    <router-view></router-view>
  </div>
</template>
<script>
export default {
  name: "BreadCrumb",
  data() {
    return {
      breadList: [
        {
          name: "首页",
          path: "/"
        },
        {
          name: "关于",
          path: "/about"
        },
        {
          name: "用户",
          path: "/user/:id=1234"
        }
      ]
    };
  }
};
</script>